function createBlock() {
    return $("<span>").addClass("block");
}

function createRow(blockCount) {
    const div = $("<div>").addClass("row");
    const blocks = [];
    for (let i = 0; i < blockCount; i++) {
        const block = blocks[i] = createBlock();
        div.append(block);
    }

    return {
        jo: div,
        blocks: blocks
    };
}

export class Matrix {
    constructor(width, height) {
        this.width = width;
        this.height = height;
    }

    getBlock(x, y) {
        if (typeof x === "object") {
            y = x.y;
            x = x.x;
        }

        if (x >= this.width || y >= this.height) {
            return null;
        }

        return this.matrix[y][x];
    }

    build(container) {
        const rows = [];

        for (let i = 0; i < this.height; i++) {
            rows[i] = createRow(this.width);
        }

        this.matrix = rows.map(row => row.blocks);

        const divs = rows.map(row => row.jo);
        if (container) {
            container.append(divs);
            return this;
        } else {
            return divs;
        }
    }

    render(parts) {
        this.matrix.forEach(row => {
            row.forEach(block => {
                block.removeClass().addClass("block");
            });
        });

        parts.forEach(part => {
            this.getBlock(part).addClass(part.c);
        });
    }
}
